<template>
    <view :class="uiStyle == 1 ? '' : 'uiStyle'" >
        <!-- pages/wallet/index.wxml -->
       <topBar text="我的钱包" :needBack="true"></topBar>
       <view class="head-block"  v-if="weixin == 2">
            <!-- <image src="../../static/assets/img/my/jifenBG.png" class="bgimg" mode="widthFix"></image> -->
            <view class="nav-title" :style="'top:10px'"></view>
        </view>
        <!-- 返回 -->
       <view class="icon"  v-if="weixin == 2" @tap="goMy" :style="'top:10px'">
            <van-icon name="arrow-left" color="#fff" size="45rpx" />
        </view>
        <view class="wallet">
            <view class="header">
                <image class="swiperBg" src="../../static/assets/img/card-lv-hover.png" mode="widthFix" style="width: 100%"></image>
                <view style="position: relative">
                    <view class="header-t">总收益(元)</view>
                    <view class="header-m">¥{{ allMoney }}</view>
                    <view class="header-f">
                        <view class="header-f-m">
                            <view class="header-f-m1">钱包余额:</view>
                            <view class="header-f-m2">¥{{ balance }}</view>
                        </view>
                        <view class="header-f-m">
                            <view class="header-f-m1">已提现:</view>
                            <view class="header-f-m2">¥{{ withdrawalMoney }}</view>
                        </view>
                        <view class="header-f-m">
                            <view class="header-f-m1">交易在途:</view>
                            <view class="header-f-m2">¥{{ frozenBalance }}</view>
                        </view>

                        <!-- <view class="header-f-m" bindtap="goRecord">
                <view class="header-f-m3">提现记录</view>
            </view> -->
                    </view>
                    <view class="header-ch">
                        <!-- <view bindtap="setPay">快捷支付设置</view> -->
                        <image src="../../static/assets/img/wallet2.png" mode="widthFix" style="width: 30rpx; margin-right: 5rpx; padding-top: 0rpx"></image>
                        <text @tap="goCash" class="gocash">去提现</text>
                        <view>*钱包余额满200元即可提现</view>
                    </view>
                </view>
            </view>
            <view class="body">
                <view class="header-ch2">
                    <view class="lineBule"></view>
                    <view>提现记录</view>
                    <view class="lineBule2"></view>
                </view>
                <view class="record">
                    <view class="records" v-if="listHis.length > 0">
                        <view class="tab record-list" v-for="(item, key) in listHis" :key="item.key">
                            <view class="record-title">
                                <view class="record-title-l">{{ item.createTime }}</view>
                                <!-- <view class="record-title-r">{{item.failureFlagtype}}</view> -->
                            </view>

                            <view class="record-body">
                                <view class="record-b">
                                    <view class="record-b-l">
                                        <image src="../../static/assets/img/re1.png" mode="widthFix"></image>
                                        <view class="record-b-l-t1">银行卡</view>
                                        <view class="record-b-l-t2">{{ item.bankCardNum }}</view>
                                    </view>
                                    <view class="record-b-l">
                                        <image src="../../static/assets/img/re2.png" mode="widthFix"></image>
                                        <view class="record-b-l-t1">开户行</view>
                                        <view class="record-b-l-t2">{{ item.bankAccount }}</view>
                                    </view>
                                    <view class="record-b-l">
                                        <image src="../../static/assets/img/re3.png" mode="widthFix"></image>
                                        <view class="record-b-l-t1">持卡人</view>
                                        <view class="record-b-l-t2">{{ item.name }}</view>
                                    </view>
                                </view>
                                <view class="record-b-r">
                                    <view class="record-b-r-t1">{{ item.withdrawalAmount }}元</view>
                                    <view v-if="item.withdrawState == -1 || item.withdrawState == 0" class="record-b-r-t2w">
                                        {{ item.withdrawStatetype }}
                                    </view>
                                    <view v-else class="record-b-r-t2">{{ item.withdrawStatetype }}</view>
                                </view>
                            </view>
                        </view>
                    </view>
                    <view v-else>
                        <view class="nopark">
                            <image src="../../static/assets/img/empty.png"></image>
                        </view>
                        <view class="nopark-text" style="text-align: center;">暂无提现记录</view>
                    </view>
                </view>
                <!-- <van-tabs active="{{ active }}" bind:change="onChange">
            <van-tab title="临停共享收益">
                <view wx:if="{{list&&list.length>0}}">
                    <view wx:for="{{list}}" class="tab" wx:for-index='key' wx:key="key">
                    <view class="tab-card">
                        <view class="tab-header">
                            <view class="tab-header-l">{{item.startTime}}-{{item.endTime}}</view>
                            <view class="tab-header-r">{{item.durationDesc}}</view>
                        </view>
                        <view class="tab-body">
                            <view class="tab-body-l">
                                {{item.parkingSpaceNo}}{{item.parkingName}}
                            </view>
                            <view class="tab-body-r">{{item.actualPay}}</view>
                        </view>
                        <view class="tab-footer">{{item.plateNo}}</view>
                    </view>
                </view></view>
            <view wx:else>
                <view class="nopark">
                <image src="/assets/img/empty.png"></image>
                </view>
                <view class="text">暂无数据</view>
            </view>
            </van-tab>
            <van-tab title="包月出租车位收益">
                <view wx:if="{{list&&list.length>0}}">
                    <view wx:for="{{list}}" class="tab" wx:for-index='key' wx:key="key">
                    <view class="tab-card">
                        <view class="tab-header">
                            <view class="tab-header-l">{{item.startTime}}-{{item.endTime}}</view>
                            <view class="tab-header-r">{{item.durationDesc}}</view>
                        </view>
                        <view class="tab-body">
                            <view class="tab-body-l">
                                {{item.parkingSpaceNo}}{{item.parkingName}}
                            </view>
                            <view class="tab-body-r">{{item.actualPay}}</view>
                        </view>
                        <view class="tab-footer">{{item.plateNo}}</view>
                    </view>
                </view>
                </view>
            <view wx:else>
                <view class="nopark">
                <image src="/assets/img/empty.png"></image>
                </view>
                <view class="text">暂无数据</view>
            </view>
            </van-tab>
        </van-tabs> -->
            </view>
        </view>
    </view>
</template>

<script>
import util from './../../utils/util.js';
import api from './../../utils/api.js'; // pages/wallet/index.js

export default {
    data() {
        return {
            listHis: [],
            list: [],
            allMoney: ' ',
            withdrawalMoney: ' ',
            balance: ' ',
            frozenBalance: '',
            active: 0,
			uiStyle:1,
			weixin:uni.getStorageSync('weixin')
        };
    }
    /**
     * 生命周期函数--监听页面加载
     */,
    onLoad: function (options) {
		this.uiStyle = uni.getStorageSync('uiStyle')
        const unionId = uni.getStorageSync('unionId');
        this.getmyInCome(unionId);
        this.getWithdrawlist(); // this.getMyInComeList();
    },
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady: function () {},
    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {},
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {},
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload: function () {},
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh: function () {},
    /**
     * 页面上拉触底事件的处理函数
     */
    // onShareAppMessage: function() {}
    onReachBottom: function () {},
    /**
     * 用户点击右上角分享
     */ methods: {
        getWithdrawlist() {
            const param = {
                unionId: uni.getStorageSync('unionId') //"a8dc023a-eda2-45e2-ad9b-b97fb100620f"
            };
            util.request(api.Withdrawlist, param, 'POST').then((res) => {
                if (res.code == 0) {
                    if (res.data.content && res.data.content.length > 0) {
                        res.data.content.forEach((e) => {
                            if (e.withdrawState == -1) {
                                e.withdrawStatetype = '申请处理中';
                            } else if (e.withdrawState == -2) {
                                e.withdrawStatetype = '提现失败';
                            } else if (e.withdrawState == 1) {
                                e.withdrawStatetype = '已提现';
                            }

                            if (e.failureFlag == 0) {
                                e.failureFlagtype = '处理中';
                            } else if (e.failureFlag == -1) {
                                e.failureFlagtype = '打款失败';
                            } else {
                                e.failureFlagtype = '';
                            }
                        });
                        this.setData({
                            listHis: res.data.content
                        });
                    }
                }
            });
        },
        goMy() {
            uni.navigateBack({
                delta: 1
            });
        },
        onChange(e) {
            this.setData({
                active: e.detail.index
            });
            this.getMyInComeList();
        },

        goCash() {
            if (+this.balance < 200) {
                uni.showToast({
                    title: '钱包余额满200元即可提现',
                    icon: 'none'
                });
                return;
            }

            uni.navigateTo({
                url: '../Cash/index'
            });
        },

        setPay() {
            uni.showToast({
                title: '功能开发中，敬请期待',
                icon: 'none'
            });
        },

        getMyInComeList() {
            const param = {
                unionId: uni.getStorageSync('unionId'),
                type: this.active == 0 ? 1 : 2,
                pageNumber: 1,
                pageSize: 100
            };
            util.request(
                api.MyInComeList + '?unionId=' + param.unionId + '&type=' + param.type + '&pageNumber=' + param.pageNumber + '&pageSize=' + param.pageSize,
                '',
                'POST'
            ).then((res) => {
                if (res.code == 0) {
                    const data = res.data.content.forEach((e) => {
                        e.actualPay = e.actualPay / 100;
                    });
                    this.setData({
                        list: res.data.content
                    });
                }
            });
        },

        //我的钱包
        getmyInCome(unionId) {
            util.request(api.getMyInCome + '?unionId=' + unionId, 'get').then((res) => {
                if (res.code == 0) {
                    const allMoney = res.data.allMoney ? res.data.allMoney / 100 : 0;
                    const withdrawalMoney = res.data.withdrawalMoney ? res.data.withdrawalMoney / 100 : 0;
                    const frozenBalance = res.data.frozenBalance ? res.data.frozenBalance / 100 : 0;
                    const balance = res.data.balance ? res.data.balance / 100 : 0;
                    this.setData({
                        allMoney: allMoney,
                        withdrawalMoney: withdrawalMoney,
                        balance: balance,
                        frozenBalance: frozenBalance
                    });
                } else {
                    uni.showToast({
                        title: res.msg,
                        icon: 'none'
                    });
                }
            });
        },

        goRecord() {
            uni.navigateTo({
                url: '../record/index'
            });
        }
    }
};
</script>
<style>
@import './index.css';
</style>
